葫芦的运维日志_cssjshtml

✸ ✸ ✸

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>counter</title>
    <style>
        #cavans {
            border: 1px solid #333;
            text-align: center;
            width: 400px;
            height: 250px;
        }
    </style>
</head>
<div id="app">
    <div id="cavans" @mousemove="updatexy">
        {{x}},{{y}}
    </div>
</div>
<script src="/static/js/vue.min.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            x: 0,
            y: 0
        },
        methods: {
            updatexy: function (event) {
                this.x=event.offsetX;
                this.y=event.offsetY;
            }

        }

    })
</script>
</html>

✸ ✸ ✸

本文作者：王梓 | 原文链接：https://www.bthlt.com/note/6610674-CssJsHtmlvue.js 鼠标监听

出处：葫芦的运维日志 | 转载请注明出处并保留原文链接

📜 留言板

留言提交后需管理员审核通过才会显示